<script>

EscherMixins.ReactiveSignal = {
  properties: {
    name: {
      type: String,
      value: null,
      observer: "_nameChanged"
    },
    index: {
      type: Number,
      value: false
    },
    bubbles: {
      type: Boolean,
      value: false
    },
    selector: {
      type: String,
      value: "::parent"
    }
  },

  // This should be overriden by children
  // for the benefit of signal-sampler
  getValue: function () {
    return this.value
  },

  findElem: function () {
    var self = Polymer.dom(this)
    if (this.selector === "::parent") {
      return self.parentNode
    } else {
      return self.parentNode.querySelector(this.selector)
    }
  },

  setId: function (name) {
    this.setAttribute("id", "signal-" + (name || this.name))
  },

  _nameChanged: function (name) {
    this.setId(name)
  },

  getNamedSignal: function (elem, name) {
    return elem._escherSignals && elem._escherSignals[name]
  },

  update: function (sourceElement, value) {
    this.value = value // Save for the sampler
    this.fire("signal-updated", {
      name: this.name,
      index: this.index,
      source: sourceElement,

      value: value
    },
    { bubbles: this.bubbles || false }
    )
    if (this.bubbles && !this.parentNode) {
      Polymer.dom(this).parentNode.fire("signal-updated", {
        name: this.name,
        index: this.index,
        source: sourceElement,

        value: value
      },
      { bubbles: this.bubbles || false }
      )
    }
  }
}

</script>


<dom-module
  id="stop-bubbling" >

<template></template>

<script>

Polymer({
  is: "stop-bubbling",
  properties: {
    behaviors: [EscherMixins.LifeCycle, EscherMixins.ReactiveSignal],
    names: {
      type: Array,
      value: []
    }
  },

  domInit: function () {
    var self = this, elem = this.findElem()

    elem.addEventListener("signal-updated", function (ev) {
        if (self.names.indexOf(ev.detail.name) >= 0) {
            ev.stopPorpagation()
        }
    })

  }
})

</script>

</dom-module>


<dom-module
  id="signal-transport" >

<template></template>

<script>

Polymer({

  is: "signal-transport",
  behaviors: [EscherMixins.LifeCycle, EscherMixins.ReactiveSignal],

  properties: {
    signalId: String,
    name: String
  },

  domInit: function () {
    var self = this, elem = this.findElem()

    elem.addEventListener("signal-updated", function (ev) {
      Polymer.Base.fire.call(document, "signal-transport", {
        signalId: self.signalId,
        value: ev.detail.value
      }) // Hand-off new signal value to web socket
    })
  }
})

</script>

</dom-module>



<dom-module
  id="chan-send" >

<template></template>

<script>

Polymer({
    is: "chan-send",

    behaviors: [EscherMixins.LifeCycle, EscherMixins.ReactiveSignal],

    properties: {
      chan: String,
      watch: String,
    },

    domInit: function () {
      var self = this,
        elem = this.findElem()

      //console.log("Setting up chan-send", this.chan, this.watch)
      elem.addEventListener("signal-updated", function (ev) {
        elem.fire("chan-updated-" + self.chan, {
            value: ev.detail.value
        })
      })
    }
})

</script>
</dom-module>



<dom-module
    name="chan-recv"
    attributes="chan attr">

<template></template>

<script>

  Polymer({
    is: "chan-recv",

    behaviors: [EscherMixins.LifeCycle, EscherMixins.ReactiveSignal],

    properties: {
      chan: String,
      attr: String,
    },
    domInit: function () {
        var self = this,
          elem = this.findElem()

        document.addEventListener("chan-updated-" + this.chan, function (ev) {
            elem.setAttribute(self.attr, ev.detail.value)
        })
    }
})

</script>

</dom-module>
